/**
 *  @view
 *  @互联家商户房型页面 
 */

import React, { Component } from 'react';
import { StyleSheet, ScrollView, View, Text, Image, TouchableHighlight } from 'react-native';

/**
 *  @style
 *  @页面主要样式表导入
 */
import salesAmountStyle from '../styles/salesAmount';

/**
 *  @image
 */
const salesAmountImg = require('../assets/images/img/salesAmount.png');
const enterImg = require('../assets/images/img/enter.png');

export default class SalesAmountScreen extends Component {

  static navigationOptions = {
    headerTitle: '我的账户',
    headerRight: <View />,
  };

  render() {
    return (
      <ScrollView style={styles.scrollBox}>

        <View style={styles.container}>
          <View style={styles.topImageBox}>
            <Image style={styles.topImage} source={salesAmountImg} />
            <View style={styles.topThemeBox}>
              <Text style={styles.topThemeBoxTitle}>今日销售</Text>
              <Text style={styles.topThemeBoxValue}>987654321.00</Text>
            </View>
          </View>

          <View style={styles.salesTitleBox}>
            <View style={styles.salesTitleBoxL}>
              <View style={styles.salesTitleBoxLBorder}></View>
              <Text style={styles.salesTitleBoxLTitle}>销售明细</Text>
            </View>
            <TouchableHighlight underlayColor="#ffffff" onPress={() => this.props.navigation.navigate('SalesDetail')}>
              <View style={styles.salesTitleBoxR}>
                <Text style={styles.salesTitleBoxRTitle}>查看明细</Text>
                <Image style={styles.salesTitleBoxRImage} source={enterImg} />
              </View>
            </TouchableHighlight>
          </View>

          <View style={styles.salesItemBox}>
            <View>
              <Text style={styles.salesItemTitle}>[ 预定 ] 豪华大水床</Text>
              <Text style={styles.salesItemTime}>2018-4-10 11:280:34</Text>
            </View>
            <Text style={styles.salesItemAddFee}>+300</Text>
          </View>

          <View style={styles.salesItemBox}>
            <View>
              <Text style={styles.salesItemTitle}>[ 退房 ] 豪华大水床</Text>
              <Text style={styles.salesItemTime}>2018-4-10 11:280:34</Text>
            </View>
            <Text style={styles.salesItemReFee}>-300</Text>
          </View>

          <View style={styles.salesItemBox}>
            <View>
              <Text style={styles.salesItemTitle}>[ 预定 ] 豪华大水床</Text>
              <Text style={styles.salesItemTime}>2018-4-10 11:280:34</Text>
            </View>
            <Text style={styles.salesItemAddFee}>+300</Text>
          </View>

          <View style={styles.salesItemBox}>
            <View>
              <Text style={styles.salesItemTitle}>[ 预定 ] 豪华大水床</Text>
              <Text style={styles.salesItemTime}>2018-4-10 11:280:34</Text>
            </View>
            <Text style={styles.salesItemAddFee}>+300</Text>
          </View>

        </View>

      </ScrollView>
    );
  };
};

const styles = StyleSheet.create(salesAmountStyle);